<%-- 
    Document   : RequestReport
    Created on : Oct 16, 2011, 12:20:18 PM
    Author     : Mikeno
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Request Report</title>
        <script src="scripts/jquery-1.6.4.min.js"></script>
        <link rel="stylesheet" href="style/960.css" type="text/css" />
        <link rel="stylesheet" href="style/960_12_col.css" type="text/css" />
        <link rel="stylesheet" href="style/desk.css" type="text/css" />
        <link rel="stylesheet" href="style/reset.css" type="text/css" />
        <script type = "text/javascript">

            function initRequest() {
                if (window.XMLHttpRequest) {
                    return new XMLHttpRequest();
                } else if (window.ActiveXObject) {
                    isIE = true;
                    return new ActiveXObject("Microsoft.XMLHTTP");
                }
            }

            function lookup(searchValue) {

                if(searchValue.length == 0) {
                    // Hide the suggestion box.
                    $('#suggestions').hide();
                } else {
                    empty();
                    var url = "/HyperMarket/AjaxStringLookUpServlet?searchValue="+searchValue;
                    var req = initRequest();
                    req.onreadystatechange = function() {
                        if (req.readyState == 4) {
                            if (req.status == 200) {
                                parseMessages(req.responseXML);
                            } else if (req.status == 204){
                            }
                        }
                    };
                    req.open("POST", url, true);
                    req.send(null);
                }
            }


            function parseMessages(responseXML) {
                var stocks = responseXML.getElementsByTagName("stocks")[0];
                if(stocks.childNodes.length > 0){
                    for(var k=0; k<stocks.childNodes.length; k++){
                        var stockDetails = stocks.childNodes[k];
                        var temp = stockDetails.getElementsByTagName("id")[0];
                        var id =temp.childNodes[0].nodeValue;
                        var temp = stockDetails.getElementsByTagName("name")[0];
                        var name =temp.childNodes[0].nodeValue;
                        var new_list = document.createElement('li');
                        new_list.setAttribute("onclick","fill('"+id+"','"+name+"')");
                        new_list.innerHTML = name;
                        document.getElementById("autoSuggestionsList").appendChild(new_list);
                    }
                    document.getElementById("suggestions").style.display = "inline-block";
                }
            }

            function empty(){
                $('#suggestions').hide();
                $('#autoSuggestionsList').empty();
            }
            function fill(id,name) {
                $('#inputString').val(name);
                $('#detail').val(id);
                setTimeout("$('#suggestions').hide();", 200);
                document.getElementById("detail").value = id;

            } 
        </script>
    </head>
    <body>
        <form action="/HyperMarket/ProcessRequestReportServlet" method="post" id="requestreport">
            <div class="container_12">
                <div class="grid_6 suffix_6">
                    <br><br>
                    <div class="grid_6">
                        Enter Stock You Wish To Request For Discount :
                        <input class="grid_6" id="inputString" onkeyup="lookup(this.value);" size="30" type="text" />
                    </div>
                    <br><br>
                    <div class="grid_3">
                        Reason:
                        <div class="grid_6">
                            <textarea id="reason" name="reason" rows="4" cols="25">

                            </textarea>
                        </div>
                    </div>
                    <div id="suggestions" class="grid_3" style="display: none;">
                        <img style="position: relative; top: -12px; left: 30px;" src="./arts/upArrow.png" alt="upArrow" />
                        <div id="autoSuggestionsList">
                        </div>
                    </div>


                    <div class="prefix_3 grid_2 suffix_1">
                        <button class=" ovaction ovactionbig ovactionprimary" style="margin: 5px 10px 0 -1px;" onclick="document.requestreport.submit();">Done Creating</button>
                    </div>
                </div>
            </div>
            <input type="hidden" id="detail" value="">
        </form>
    </body>
</html>

